<template>
  <router-view/>
</template>

<script setup>
import {provide, ref} from 'vue'
import {useRouter} from 'vue-router'
import translate from '@/hooks/use-lang'
import request from '@/hooks/use-http'
import {ElMessage} from 'element-plus'

const router = useRouter()
// 配置全局页面参数
const layout = ref({
  pageLoading: false, // 全局页面加载
  mainLoading: false, // 主页面加载
  // 网页宽度
  htmlWidth: document.body.clientWidth || document.documentElement.clientWidth || window.innerWidth || 0,
  // 网页高度
  htmlHeight: document.body.clientHeight || document.documentElement.clientHeight || window.innerHeight || 0,
  // 菜单宽度
  menuWidth: 200,
})
provide('router', router)
provide('layout', layout)
provide('translate', translate)
provide('getRandomColor', () => {
  let h = Math.floor(Math.random() * 360 + 1)
  let s = Math.random()
  let b = Math.min(Math.random() + 0.6, 1)
  let i = Math.floor((h / 60) % 6)
  let f = (h / 60) - i
  let p = b * (1 - s)
  let q = b * (1 - (f * s))
  let t = b * (1 - ((1 - f) * s))
  switch (i) {
    case 0: return `rgb(${~~(b * 255)},${t * 255},${p * 255})`
    case 1: return `rgb(${~~(q * 255)},${b * 255},${p * 255})`
    case 2: return `rgb(${~~(q * 255)},${b * 255},${t * 255})`
    case 3: return `rgb(${~~(p * 255)},${q * 255},${b * 255})`
    case 4: return `rgb(${~~(t * 255)},${p * 255},${b * 255})`
    case 5: return `rgb(${~~(b * 255)},${p * 255},${q * 255})`
  }
})
// 配置请求响应拦截器，打印错误信息
request.interceptors.response.use(res => {
      if (res.data.code < 0) {
        let arr = res.data['msg']['split'](' : ')
        ElMessage.error(arr.length > 1 ? `${arr[0]} : ${translate(arr[1])}` : translate(arr[0]))
        return Promise.reject(res)
      }
      return Promise.resolve(res)
    },
    err => {
      if (err.response) {
        let msg = 400 ? 'Bad Request' : 401 ? 'Unauthorized' : 402 ? 'Payment Required' : 403 ? 'Forbidden' :
            404 ? 'Not Found' : 405 ? 'Method Not Allowed' : 406 ? 'Not Acceptable' :
                407 ? 'Proxy Authentication Required' : 408 ? 'Request Timeout' : 409 ? 'Conflict' :
                    410 ? 'Gone' : 411 ? 'Length Required' : 412 ? 'Precondition Failed' :
                        413 ? 'Request Entity Too Large' : 414 ? 'Request-URI Too Long' :
                            415 ? 'Unsupported Media Type' : 416 ? 'Requested Range Not Satisfiable' :
                                417 ? 'Expectation Failed' : 500 ? 'Internal Server Error' :
                                    501 ? 'Not Implemented' : 502 ? 'Bad Gateway' :
                                        503 ? 'Service Unavailable' : 504 ? 'Service Unavailable' :
                                            505 ? 'HTTP Version Not Supported' : 'Other Error'
        if (err.response.data && err.response.data['msg'])
          msg = err.response.data['msg']
        msg && ElMessage.error(translate(msg))
        return Promise.reject(msg)
      }
      // 处理断网或请求中断情况
      return new Promise(() => {})
    }
)
window.addEventListener('resize', () => {
  layout.value.htmlWidth = document.body.clientWidth || document.documentElement.clientWidth || window.innerWidth || 0
  layout.value.htmlHeight = document.body.clientHeight || document.documentElement.clientHeight || window.innerHeight || 0
})
document.oncontextmenu = new Function('event.returnValue=false')
window.request = request
console.log(`%c ZZONE Ver.${process.env.VUE_APP_VERSION} %c Web: https://zzone.cc`,
    'background: #122; color: #fff; padding: 4px 0', '')
</script>
